import 'package:car_controller/Services/Get/get_car.dart';
import 'package:car_controller/widget/car_part.dart';
import 'package:car_controller/widget/text_widget.dart';
import 'package:car_controller/theme/app_theme.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';

class Car extends StatelessWidget {
  Car({super.key});

  final GetCar controller = Get.put(GetCar());

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        decoration: BoxDecoration(gradient: AppTheme.mainGradient),
        child: Column(
          children: [
            Expanded(
              flex: 4,
              child: Stack(
                children: [
                  Positioned(
                    top: 100,
                    left: 50,
                    child: Align(
                      alignment: Alignment.bottomCenter,
                      child: Container(
                        height: 300,
                        width: 350,
                        decoration: const BoxDecoration(
                          image: DecorationImage(
                            image: AssetImage('assets/images/car.png'),
                            fit: BoxFit.contain,
                          ),
                        ),
                      ),
                    ),
                  ),
                  Positioned(
                    top: 70,
                    left: AppTheme.defaultPadding,
                    right: AppTheme.defaultPadding,
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        text(
                          "法拉利",
                          AppTheme.headingFontSize,
                          AppTheme.textPrimaryColor,
                          FontWeight.bold,
                          letterspacel: 8.0,
                        ),
                        Container(
                          height: 40,
                          width: 40,
                          decoration: BoxDecoration(
                            shape: BoxShape.circle,
                            color: AppTheme.primaryColor.withOpacity(0.2),
                          ),
                          child: Center(
                            child: Icon(
                              Icons.sunny,
                              color: AppTheme.textPrimaryColor,
                            ),
                          ),
                        ),
                      ],
                    ),
                  ),
                  Positioned(
                    top: 120,
                    left: AppTheme.defaultPadding,
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        text(
                          "蓝色 488 Spider",
                          AppTheme.subheadingFontSize,
                          AppTheme.textSecondaryColor,
                          FontWeight.bold,
                        ),
                        text(
                          "控制面板",
                          AppTheme.headingFontSize,
                          AppTheme.textPrimaryColor,
                          FontWeight.bold,
                        ),
                        const SizedBox(height: 20),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Obx(
                              () => CarPart(
                                name: "引擎",
                                state: controller.engin.value,
                                onTap: () => controller.setEngine(),
                              ),
                            ),
                            Obx(
                              () => CarPart(
                                name: "空调",
                                state: controller.ac.value,
                                onTap: () => controller.setAc(),
                              ),
                            ),
                          ],
                        ),
                      ],
                    ),
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}
